<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <script>
        //创建Ajax对象 
        var xhr = new XMLHttpRequest();
        //告诉Ajax请求方式和请求地址
        xhr.open('get','http://localhost:3000/responseData');
        //3.发送请求
        xhr.send();
        //获取服务器端响应的数据
        xhr.onload = function(){
            // xhr.responseText响应文本
            console.log(xhr.responseText);
            console.log(typeof xhr.responseText);
            /*在http请求与响应的过程中，无论请求参数还是响应内容，
            如果是对象类型，最终都会被转换成字符串进行传输*/
            //JSON.pares()将JSON字符串转换成JSON对象
            var responseText = JSON.parse(xhr.responseText);
           console.log(responseText);
           console.log(typeof responseText);
           var str = '<h2>'+responseText.name+'</h2>';
           document.body.innerHTML = str;
        }
    </script>
</body>
</html>